<!DOCTYPE html>
<html lang="en">
    
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/index.css">
    
</head>
<body>
    <div class="container">
        <!-- 轮播图图片 -->
        <div class="banner-img banner-active">
            <img class="img-auto" src="./images/banner01.jpg" alt="">
        </div>
        <div class="banner-img">
            <img class="img-auto" src="./images/banner02.jpg" alt="">
        </div>
        <div class="banner-img">
            <img class="img-auto" src="./images/banner03.jpg" alt="">
        </div>
        <div class="banner-img">
            <img class="img-auto" src="./images/banner04.jpg" alt="">
        </div>

        <!-- 侧边栏信息 -->
        <div class="sidebar">
            <div class="sidebar-item">手机 电话卡</div>
            <div class="sidebar-item">电视 盒子</div>
            <div class="sidebar-item">笔记本 显示器 平板</div>
            <div class="sidebar-item">家电 插线板</div>
            <div class="sidebar-item">出行 穿戴</div>
            <div class="sidebar-item">智能 路由器</div>
            <div class="sidebar-item">电源 配件</div>
            <div class="sidebar-item">健康 儿童</div>
            <div class="sidebar-item">耳机 音箱</div>
            <div class="sidebar-item">生活 箱包</div>
        </div>

        <!-- 侧边栏隐藏信息 动态生成-->
        <div class="sidebar-info"></div>

        <!-- 左侧按钮 -->
        <div class="left-box btns"></div>
        <!-- 右侧按钮 --> 
        <div class="right-box btns"></div>

        <!-- 小圆点 -->
        <div class="list">
            <div class="list-item active"></div>
            <div class="list-item"></div>
            <div class="list-item"></div>
            <div class="list-item"></div>
        </div>
    </div>
    <script src="./js/index.js"></script>
</body>

</html>